<extend name="Public/layout"/>
<block name="style" >
    <link rel="stylesheet" type="text/css" href="__LYUI__/css/lyui.extend.min.css">
    <link rel="stylesheet" type="text/css" href="__ADMIN_CSS__/style.css">
    <style type="text/css">
        .tree {
              min-height:400px;
             
            }
            .tree li {
              list-style-type:none;
              margin:0;
              padding:10px 5px 0 5px;
              position:relative
            }
            .tree li::before, .tree li::after {
              content:'';
              left:-20px;
              position:absolute;
              right:auto
            }
            .tree li::before {
              border-left:1px solid #999;
              bottom:50px;
              height:100%;
              top:0;
              width:1px
            }
            .tree li::after {
              border-top:1px solid #999;
              height:20px;
              top:25px;
              width:25px
            }
            .tree li span {
              -moz-border-radius:5px;
              -webkit-border-radius:5px;
              border:1px solid #999;
              border-radius:5px;
              display:inline-block;
              padding:3px 8px;
              text-decoration:none
            }
            .tree li.parent_li>span {
              cursor:pointer
            }
            .tree>ul>li::before, .tree>ul>li::after {
              border:0
            }
            .tree li:last-child::before {
              height:30px
            }
            .tree li.parent_li>span:hover, .tree li.parent_li>span:hover+ul li span {
              background:#eee;
              border:1px solid #94a0b4;
              color:#000
            }
            .tree > ul> li{
              display: block !important;
            }
            .blue{
                color: #3fa9f5;
                font-weight: 900;
            }
    </style>
</block>

<block name="main">
   <div id="main" class="col-xs-12 col-sm-9 main" style="overflow-y: scroll;">
        <!-- 面包屑导航 -->
        <ul class="breadcrumb">
            <li><i class="fa fa-map-marker"></i></li>
            <foreach name="_menu_tab['name']" item="tab_v" >
            <li class="text-muted">{$tab_v}</li>
            </foreach>
        </ul>

        <!-- 主体内容区域 -->
        <div class="tab-content ct-tab-content">
            <div class="panel-body">
                <div class="builder formbuilder-box">
                        
                        <div class="form-group"></div>

                        <!-- 顶部工具栏按钮 -->
                        <div class="builder-toolbar">
                            <div class="row">
                                <!-- 搜索框 -->
                                <div class="col-xs-12 col-sm-4 clearfix">
                                    <form class="form" method="get" action="">
                                        <div class="form-group">
                                            <div class="input-group search-form">
                                                <input type="text" name="keyword" class="search-input form-control" value="{$_GET.keyword}" placeholder="请输入ID/姓名／账号">
                                                <span class="input-group-btn"><a class="btn btn-default search-btn"><i class="fa fa-search"></i></a></span>
                                            </div>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                        
                        <!-- 数据列表 -->
                        <div class="builder-container">
                            <div class="row">
                                <div class="col-xs-12">
                                    <div class="builder-table">
                                        <div class="panel panel-default table-responsive">
                                        <!-- 树 -->
                                          <div class="tree">
                                            {$tree}
                                          </div>
                                          <!-- 树 -->
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                </div>
            </div>
    </div>                   
</div>
</block>

<block name="script">
    <script type="text/javascript" src="__LYUI__/js/lyui.extend.min.js"></script>
    <script type="text/javascript">
        $(function () {
          $('.tree li:has(ul)').addClass('parent_li').find(' > span').attr('title', '折叠');
          $('.tree li.parent_li > span').on('click', function (e) {
            var children = $(this).parent('li.parent_li').find(' > ul > li');
            if (children.is(":visible")) {
              children.hide('fast');
              $(this).attr('title', '展开').find(' > i').addClass('icon-plus-sign').removeClass('icon-minus-sign');
            } else {
              children.show('fast');
              $(this).attr('title', '折叠').find(' > i').addClass('icon-minus-sign').removeClass('icon-plus-sign');
            }
            e.stopPropagation();
          });
        });
    </script>
</block>